<script setup>
	import {ref} from 'vue';
	import categoryApi from "@/api/product/category.js";
	
	// 定义list属性模型
	const list = ref([])
	
	const loadData = () => {
		categoryApi.selectCategoryTree().then(result => {
			list.value = result.data
		})
	}
	//加载数据
	loadData()
</script>

<template>
	<div class="back">
		<el-card class="">
			<el-table
				:data="list"
				style="width: 100%"
				row-key="id"
				border
				lazy
				:load="loadData"
				:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
			>
				<el-table-column prop="name" label="分类名称"/>
				<el-table-column prop="image" label="图标" #default="scope">
					<img :src="scope.row.image" width="50"/>
				</el-table-column>
				<el-table-column prop="orderNum" label="排序"/>
				<el-table-column prop="status" label="状态" #default="scope">
					{{ scope.row.status == 1 ? '正常' : '停用' }}
				</el-table-column>
				<el-table-column prop="createTime" label="创建时间"/>
			</el-table>
		</el-card>
	</div>
</template>

<style scoped>

</style>